<template>
  <!--组织设置页面-->
  <!--一个大的div包含两个小div，其中一个小div分为左右两部分-->
  <div id="11">
    <!--组织设置到新增按钮 和修改组织-->
    <div class="firstdiv">
      <div>
        <h2>组织设置</h2>
        <hr>
      </div>

    </div>
    <!--下面整个部分-->
    <div class="dingwei" style="display: flex">
      <!--左边下拉框部分-->
      <div class="left" style="float:left;height: 600px;flex: 1">
        <!--树状结构-->

        <Tree @childByValue="showshow"></Tree>
      </div >
      <!--右边选择部分-->
      <div class="right" style="folat:left;height: 600px; flex: 2" >
        <div style="text-align: center">
            {{texttoo}}
        </div>
        <div style="margin-left: 140px;margin-top: 20px">
          <el-form ref="form" :model="form">
            <el-form-item label="考评起始日期">
              <el-date-picker v-model="value1" type="date" placeholder="选择日期"></el-date-picker>
            </el-form-item>
            <el-form-item label="考评截至日期">
              <el-date-picker v-model="value2" type="date" placeholder="选择日期"></el-date-picker>
             </el-form-item>
          </el-form>
        </div>
        <div>
          <el-table :data="tableData" height="250" border style="width: 100%">
            <el-table-column prop="date" label="名次" >
            </el-table-column>
            <el-table-column prop="name" label="活动数量排名" >
            </el-table-column>
            <el-table-column prop="address" label="参与率排名"  >
            </el-table-column>
            <el-table-column prop="address" label="总积分排名"  >
            </el-table-column>
          </el-table>
        </div>
        <div style="text-align: center;margin-top: 20px" >
          <el-button type="primary">导出表格</el-button>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  import Tree from '../NavBasicManagerment/tree.vue'
  import Dangform from '../NavBasicManagerment/dangForm.vue'
  export default {
    name: '',
    components: {
      Tree,Dangform
    },
    data () {
      return {
        value1:'',
        value2:'',
          texttoo:'中兴社区党建考评',
        sos:'',
        label1:{
          one:'组织领导职务',
          tuo:'登录密码',
          three:'组织领导职务'
        },
        dynamicValidateForm: {
          name: '',
          region: '',
          date1: '',
          date2: '',
          delivery: false,
          type: [],
          resource: '',
          desc: '',
          domains: [{
            name: '',
            password: '',
            job: '',

          }],
          form: {
            name: '',
            region: '',
            date1: '',
            date2: '',
            delivery: false,
            type: [],
            resource: '',
            desc: '',
            value1:'',
            value2:''
          },
          userForm: '',
          seachVue: '',
          checked: '',
          dangformame: '',
          buttonName: '',
          dialogVisible: false,
          add1: '',
          add2: '',
          add3: '',
          msg: '这个是Home模板页',
          lastzuzhi: [
            {
              value: '雷甸镇党建',
              label: '雷甸镇党建'
            },
            {
              value: '中兴社区党委',
              label: '中兴社区党委'
            },
            {
              value: '和平村党总支',
              label: '和平村党总支'
            },
            {
              value: '中兴社区一支部',
              label: '中兴社区一支部'
            },
            {
              value: '中兴社区二支部',
              label: '中兴社区二支部'
            },
            {
              value: '中兴社区三支部',
              label: '中兴社区三支部'
            },
          ],
          manys: [
            {
              name: '1',
              job: '1',
              number: '1'
            },
          ],
          addall: {
            name: '',
            job: '',
            number: '1'
          }}
      }},
    methods: {
      addOrganization(){

      },
      updateOrganization(){

      }, submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            alert('submit!');
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      },
      removeDomain(item) {
        var index = this.dynamicValidateForm.domains.indexOf(item)
        if (index !== -1) {
          this.dynamicValidateForm.domains.splice(index, 1)
        }
      },
      addDomain() {
        this.dynamicValidateForm.domains.push({
          value: '',
          key: Date.now()
        });
      }, showshow:function(dass,sss) {
        this.texttoo=dass+'党建活动考评';
      },
    },
    mounted:{


    }

  }
</script>
<style lang="postcss" scoped>
  body {
    background-color: #ff0000;
  }
  /* 第一个div*/
  .firstdiv{
    /*background-color: #E9EEF3;*/
  }
  .fff{
    position: relative;
    margin-left: 10px;

  }
  h2{
    margin-top: 40px;
    margin-left: 30px;
  }
  .firstdiv>div{
    margin-left: 20px;
    margin-right: 40px;
    margin-top: 30px;
  }
  button{

    border: none;
    /* color: white;*/
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    border-radius:12px;
  }
  #11{
    background-color:#E9EEF3 ;
  }
  .dingwei{
    padding: 20px;
    display:flex;
  }
  .left{
    flex:1;
    margin-right: 20px;
    /* border:1px solid #000;*/
    padding: 20px;
  }
  .right{
    flex:1;
    margin-right:20px;
   /* border:1px solid #000;*/
    padding: 20px;
  }

</style>
